<template>
  <div style="width: auto;height: 205px" id="echarts3">
  </div>
</template>
 
<script>
import echarts from 'echarts'
export default {
  name: 'echarts2',
  data () {
    return {
      // option配置
      option: {
        title: {
          text: '会话时长',
          subtext: '',
          left: 'center'
        },
        tooltip: {
          trigger: 'item'
        },
        legend: {
          orient: 'vertical',
          left: 'left'
        },
        series: [
          {
            name: '会话时长',
            type: 'pie',
            radius: '50%',
            data: [
            { value: 880, name: '张小九' },
              { value: 484, name: '李四' },
              { value: 300, name: 'admin' },
              { value: 448, name: 'lisa' },
              { value: 835, name: '聪明蛋' },
            
            ],
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
              }
            }
          }
        ]
      }
    }
  },
  mounted () {
    this.echartsInit()
   
  },
  methods: {
    getList() {
          const id = this.$route.query.id
          this.$http.get("/font/list/ciyun4").then((res) => {
              console.log(res)
              this.option.series[0].data = res.data
              this.echartsInit()
          });
      },
    echartsInit () {
      // 在生命周期中挂载
      echarts.init(document.getElementById('echarts3')).setOption(this.option)
    }
  }
}
</script>
 
<style scoped>
 
</style>